	<!--  D:/project/app/ydz-app-uniapp/static/images/knowledge/clinicaldetail -->
	<template>
		<view class="pagebody">
			<view class="bgfff">
				<view class="topbox">
					<NavHeader></NavHeader>
				</view>
			</view>
			<view class="head flex-row color303b39 fwbold fz40">
				<view class="head_icon"> </view>
				<view class="head_name">{{disease.name}}</view>
			</view>
			<DiseaseClinical style="border-radius: 32rpx 32rpx 0 0;" :name="disease.name" :clinicalList="clinicalList">
			</DiseaseClinical>
			<!-- <uni-pagination title="这是title" show-icon="true" :pageSize="pageSize" :total="total" :current="page" @change="changepage"></uni-pagination> -->
			<view class="pagebox">
				<!-- 统一分页器 -->
				<view class="thepager justify-between align-center">
					<view @click="tonewpage(1)" class="pagebtn" :class="page!=1?'havepage':''">
						上一页
					</view>
					<view class="pageNm">
						<span class="nowpage">{{page}}</span> <span style="margin: 0 8rpx;">/</span>{{pages}}
					</view>
					<view @click="tonewpage(2)" class="pagebtn" :class="page<pages?'havepage':''">
						下一页
					</view>
				</view>
			</view>
			<community :isshort="1"></community>
			<typenews :type="2" :disname="disease.name" :disid="disease.id" :list="ZNNewsList"></typenews>
			<AdvCom :type='2'></AdvCom>
			<typenews :type="1" :disname="disease.name" :disid="disease.id" :list="ZSNewsList"></typenews>

			<AboutDrug :drugList="drugList"></AboutDrug>
			<AdvCom :type='4'></AdvCom>
			<HotnewsCom></HotnewsCom>
			<FixedFoot :typeid="2"></FixedFoot>
		</view>
	</template>

	<script>
		import FixedFoot from '../../layouts/fixedfoot.vue';
		import NavHeader from '../../layouts/navheader.vue';
		import AdvCom from '../../layouts/advcome.vue';
		import DiseaseClinical from '../../components/generalcom/diseaseclinical.vue';
		import AboutDrug from '../../components/generalcom/aboutdrug.vue';
		import NewslistCom from '../../components/generalcom/newslistcom.vue';
		import community from '../../components/generalcom/community.vue'
		import typenews from '../../components/generalcom/typenews.vue';
		import HotnewsCom from '../../components/generalcom/hotnewcom.vue';

		import {
			getDiseaseById,
			getDrugList,
			getClinicalList,
			getNewsList,
			getotherlist
		} from '@/api/api.js'
		export default {
			components: {
				FixedFoot,
				NavHeader,
				DiseaseClinical,
				AboutDrug,
				AdvCom,
				NewslistCom,
				community,
				typenews,
				HotnewsCom
			},
			data() {
				return {
					page: 1,
					pageSize: 10,
					total: 0,
					pages:0,
					disease: {},
					clinicalList: [],
					drugList: [],
					diseaseList: [],
					ZNNewsList: [],
					ZSNewsList: []
				}
			},
			onLoad(option) {
				this.getDiseaseById(option.id)
			},
			methods: {
				// 统一分页器事件
				tonewpage(num) {
					if (num == 1) {
						if (this.page != 1) {
							this.page--
							this.getClinicalList();
							this.topPage();
						} else {
							return
						}
					} else {
						if (this.page < this.pages) {
							this.page++
							this.getClinicalList();
							this.topPage();
						} else {
							return
						}
					}
				},
				changepage(e) {
					this.page = e.current
					this.getClinicalList();
					this.topPage();
				},
				topPage() {
					uni.pageScrollTo({
						scrollTop: 0, // 滚动到页面的目标位置  这个是滚动到顶部, 0 
						duration: 30 // 滚动动画的时长
					})
				},
				getDiseaseById(id) {
					getDiseaseById(id).then(res => {
						if (200 == res.code) {
							this.disease = res.data
							let dis = {
								"diseaseId": this.disease.id
							}
							this.diseaseList.push(dis);
							this.getDrugList();
							this.getClinicalList();
							this.getotherlist();
						}
					})
				},



				// 药品列表
				getDrugList() {
					let param = {
						"pageNum": 1,
						"pageSize": 4,
						"state": "1",
						"orderByColumn": "create_time",
						"isAsc": "desc",
						"drugDiseaseList": this.diseaseList.length > 0 ? this.diseaseList : null
					}
					console.log("param", param)
					getDrugList(param).then(res => {
						if (res.code == 200) {
							this.drugList = res.rows
							console.log("this.drugList", this.drugList)
						}
					})
				},
				// 临床招募列表
				getClinicalList() {
					let param = {
						"pageNum": this.page,
						"pageSize": this.pageSize,
						"state": "1",
						"orderByColumn": "state DESC,create_time desc",
						"isAsc": "desc",
						"clinicalDiseaseList": this.disease.id ? this.diseaseList : null
					}
					getClinicalList(param).then(res => {
						if (res.code == 200) {
							this.clinicalList = res.rows
							this.total = res.total
							this.pages = Math.ceil(this.total / this.pageSize)
						}
					})
				},
				//获取疾病指南,疾病知识列表
				getotherlist() {
					let param = {
						"pageNum": 1,
						"pageSize": 5,
						"type": "01",
						"state": "1",
						"orderByColumn": "create_time",
						"isAsc": "desc",
						"diseaseId": this.disease.id
					}
					getotherlist(param).then(res => {
						if (res.code == 200) {
							this.ZNNewsList = res.rows
							console.log("指南：", this.ZNNewsList)
						}
					})
					let param1 = {
						"pageNum": 1,
						"pageSize": 5,
						"type": "02",
						"state": "1",
						"orderByColumn": "create_time",
						"isAsc": "desc",
						"diseaseId": this.disease.id
					}
					getotherlist(param1).then(res => {
						if (res.code == 200) {
							this.ZSNewsList = res.rows
							console.log("知识：", this.ZSNewsList)
						}
					})
				},
			}
		}
	</script>

	<style lang="scss" scoped>
		.pagebody {
			padding-bottom: 136rpx;
			background: #F0F6F5;

			.topbox {
				padding: 20rpx 24rpx;
				background: linear-gradient(180deg, rgba(0, 217, 178, 0.25) 0%, rgba(0, 217, 178, 0) 100%);
			}

			.head {
				padding: 58rpx 16rpx 18rpx;

				.head_icon {
					width: 8rpx;
					height: 40rpx;
					background: #00D9B2;
					border-radius: 8rpx;
					margin-top: 0.09rem;
				}

				.head_name {
					margin-left: 10rpx;
				}
			}

			.pagebox {
				background: #fff;
				padding: 32rpx 24rpx;
				border-radius: 0 0 32rpx 32rpx;

				// 统一分页器样式
				.thepager {
					.pagebtn {
						width: 178rpx;
						height: 76rpx;
						border: 1px solid #B8C3C1;
						text-align: center;
						line-height: 76rpx;
						font-weight: 400;
						font-size: 32rpx;
						color: #303B39;
						background: #fff;
						border-radius: 24rpx;
					}

					.havepage {
						color: #00D9B2 !important;
						border-color: #00D9B2 !important;
					}

					.pageNm {
						font-weight: 400;
						font-size: 32rpx;
						color: #7E8987;

						.nowpage {
							color: #303B39;

						}
					}

				}
			}
		}
</style>